<template> 
  <el-card class="form-container" shadow="never">
    <el-steps :active="active" finish-status="success" align-center>
      <el-step title="填写NFT基本信息"></el-step>
      <el-step title="填写商品状态及相关信息"></el-step>
      <!-- <el-step title="填写商品系列"></el-step> -->
    </el-steps>
    <product-info-detail v-show="showStatus[0]" v-model="productParam" :is-edit="isEdit" @nextStep="nextStep">
    </product-info-detail>
    <product-sale-detail v-show="showStatus[1]" @setStartd="setStartds" v-model="productParam" :is-edit="isEdit" @prevStep="prevStep"
      @finishCommit="finishCommit">
    </product-sale-detail>

  </el-card>
</template>
<script>
import ProductInfoDetail from './ProductInfoDetail.vue';
import ProductSaleDetail from './ProductSaleDetail.vue';
import ProductRelationDetail from './ProductSaleDetail.vue';
import { createProduct, updateMarket } from '@/api/product';
import { getRequestParamForWwwURLEncode } from '../../../../../utils/RequestParam';

import { Storage } from '../../../../../store/storage';
const defaultProductParam = {
  // children: []
};
export default {
  name: 'ProductDetail',
  components: { ProductInfoDetail, ProductSaleDetail, ProductRelationDetail },
  props: {
    isEdit: {
      type: Boolean,
      default: false,
    },
    defaultProductParam: {
      type: Object,
      default: () => Object.assign({}, defaultProductParam),
    }
  },
  data() {
    return {
      active: 0,
      productParam: {},
      showStatus: [true, false, false, false]
    }
  },
  created() {
    let res = Storage.getMarketnft();

    let result = res.filter(value => value.mid == this.$route.query.id);
    this.productParam = result[0];
    console.log(this.productParam);
  },
  methods: {
    hideAll() {
      for (let i = 0; i < this.showStatus.length; i++) {
        this.showStatus[i] = false;
      }
    },
    setStartds(value) {
      this.productParam.startTokenId = value
      this.$emit("setStartdss", value);
      console.log(value,"999999");
    },
    prevStep() {
      if (this.active > 0 && this.active < this.showStatus.length) {
        this.active--;
        this.hideAll();
        this.showStatus[this.active] = true;
      }
    },
    nextStep() {
      if (this.active < this.showStatus.length - 1) {
        this.active++;
        this.hideAll();
        this.showStatus[this.active] = true;
      }
    },
    finishCommit(isEdit) {

      this.$confirm('是否要提交该产品', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.productParam.seriesname = this.productParam.tradename;

        
        this.productParam.id = this.$route.query.id;


        updateMarket(this.productParam).then(response => {
          this.$message({
            type: 'success',
            message: '提交成功',
            duration: 1000
          });
          this.$router.back();
        });

      })
    }
  }
}
</script>
<style>
.form-container {
  width: 800px;
}
</style>


